*{
    margin: 0;
    padding: 0;
}
body{
    height: 100vh;
    width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.frame{
    width: 39vmin;
    height: 27vmin;
    background-color: #e3f2f9;
    position: relative;
    border-radius: 5vmin;
    z-index: -2;
}
.body {
    position: absolute;
    width: 15vmin;
    height: 15vmin;
    border: 0.4vmin solid #594175;
    border-radius: 50%;
    margin: 6vmin 1vmin 1vmin 1.5vmin;
}
.body:nth-of-type(1){
    left: 1vmin;
    background-color: #fecf74;
}
.dount{
    width: 5vmin;/*15/3*/
    height: 5vmin;
    border:0.4vmin solid #594175;
    background-color: #e3f2f9;
    position: absolute;
    border-radius: 50%;
    top:4.6vmin;
    left:4.6vmin;
}
/*小鸡*/
.chickf{
    position: absolute;
    width: 1vmin;
    height: 3vmin;
    background-color: #fecf74;
    border:0.4vmin solid #594175;
    border-top-right-radius: 9vmin;
    border-top-left-radius: 9vmin;
    z-index: 0;
    left: 9.6vmin;
    top:-2.5vmin;
    border-bottom: none;
}
.chickf1{
    position: absolute;
    width: 0.8vmin;
    height: 1.2vmin;
    background-color: #efcf74;
    border:0.4vmin solid #594175;
    border-top-right-radius: 9vmin;
    border-top-left-radius: 9vmin;
    z-index: 1;
    left:8vmin;
    top:-1.3vmin;
    border-bottom: none;
}
.chickf21{
    width: 2vmin;
    height: 2vmin;
    background-color: #FECF74;
    position: absolute;
    left:9vmin;
    top:-0.2vmin;
}
.chickeye{
    position: absolute;
    width: 1vmin;
    height: 1vmin;
    background-color: #594175;
    top: 11.5vmin;
    left: 4.7vmin;
    border-radius: 50%;
    box-shadow: 4.8vmin 0vmin 0vmin #594175;
}
.chicknose{
    position: absolute;
    width: 1.8vmin;
    height: 0.8vmin;
    background-color: #f69126;
    border: 0.4vmin solid #594175;
    top:11.9vmin;
    left: 6.3vmin;
    border-radius: 50%;
}
.body:nth-of-type(2){
    left: 19vmin;
    background: linear-gradient(to bottom, #123111 10%,#9a7a5c 10%,#9a7a5c 50% ,#faf3e5 50%);
}
.owleye{
    position: absolute;
    width: 2vmin;
    height: 2vmin;
    background-color: #FAF2e6;
    border:0.4vmin solid #594175;
    border-radius: 50%;
    left: 3vmin;
    top:1.8vmin;
}
.owleye1{
    position: absolute;
    width: 2vmin;
    height: 2vmin;
    background-color: #FAF2e6;
    border:0.4vmin solid #594175;
    border-radius: 50%;
    left: 9vmin;
    top:1.8vmin;
}
.owlpupil{
    width:1vmin;
    height:1vmin;
    background-color:#594175;
    border-radius:50%;
    top:2.7vmin;
    left:3.9vmin;
    position:absolute;
    box-shadow:6vmin 0vmin 0vmin 0vmin #594175;/*阴影出第二个眼睛*/
}
.owlnose{
    position: absolute;
    width: 0.8vmin;
    height: 1.4vmin;
    background-color: #fdcf74;
    border:0.4vmin solid #594175 ;
    left: 6.5vmin;
    top:2vmin;
    border-radius: 15vmin 15vmin 90vmin 90vmin;
}
.owlear1,.owlear2{
    position: absolute;
    background-color: #9a7a5c;
    width: 4vmin;
    height: 5.5vmin;
    border: 0.4vmin solid #594175;
    z-index: -1;
    left: -0.2vmin;
    top:0.5vmin;
    transform: skewy(20deg);
}
.owlear2{
    left: 10.5vmin;
    top:0.5vmin;
    transform: skewy(-20deg);
}
.owlbody{
    width: 1vmin;
    height: 1vmin;
    border:0.4vmin solid #594175;
    border-radius: 50%;
    top:9vmin;
    left:5vmin;
    position: absolute;
    border-color: transparent transparent #594175 #594175;
    transform: rotate(-45deg);
}
.owlbody2,.owlbody3,
.owlbody4,.owlbody5,
.owlbody6,.owlbody7,
.owlbody8,.owlbody9{
    width: 1vmin;
    height: 1vmin;
    border:0.4vmin solid #594175;
    border-radius: 50%;
    top: 9vmin;
    left: 2.5vmin;
    position: absolute;
    border-color: transparent transparent #594175 #594175;
    transform: rotate(-45deg);
}
.owlbody3{
    left: 8.1vmin;
}
.owlbody4{
    left: 10.8vmin;
}
.owlbody5{
    top:11vmin;
    left:4vmin;
}
.owlbody6{
    top:11vmin;
    left:6.7vmin;
}
.owlbody7{
    top:11vmin;
    left:8.7vmin;
}
.owlbody8{
    top:13vmin;
    left:5.7vmin;
}
.owlbody9{
    top:13vmin;
    left:7.7vmin;
}
.body:nth-of-type(3){
    left: 60vmin;
    background-color: #faf3e5;
    overflow: hidden;
}
.body:nth-of-type(4){
    left:80vmin;
    background-color: #ccc;
}
.body:nth-of-type(5){
    left:0vmin;
    top:25vmin;
    background-color: #fecf74;
    overflow: hidden;
}
.body:nth-of-type(6){
 
}